<template>
  <div class="like">
      <div class="top">
          <h5>{{title}}<span>{{greentitle}}</span></h5>
          <p>{{change}}</p>
      </div>
      <div class="bottom">
        <Shopsingle v-for="(v,i) in goods" :key="i" :littleimg="v.littleimg" :littletext="v.littletext" :price="v.price"/>
      </div>
  </div>
</template>

<script>
import Shopsingle from './shopsingle.vue'
export default {
  props:['title','greentitle','change','goods'],
  components:{
    Shopsingle
  }
}
</script>

<style scoped>
.like{
    width:3.2rem;
    background-color: #f2f2f2;
    margin:auto;
}
.top{
  height:0.58rem;
  display: flex;
  justify-content: space-between;
}
.top h5{
  font-size:0.18rem;
  line-height: 0.41rem;
}
.top span{
  color:#6db987
}
.top p{
  font-size:0.12rem;
  line-height: 0.41rem;
  color:#f0b784
}
.bottom{
    width:100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
</style>